﻿@{
    Layout = null;
}
<style type="text/css">
    .position-fix {
        position: absolute;
        height: 250px;
        width: 800px;
    }
</style>
<div style="height: 300px;" data-bind="foreach: kits">
    <div class="wall swiper-container position-fix" style="background-color: #fff;"></div>
    <div class="swiper-container swiper-kitmodels position-fix" data-bind="attr: { id: 'kit-' + KitId, 'data-count': ModelDtos.length }">
        <div class="swiper-wrapper" data-bind="foreach: ModelDtos">
            <div class="swiper-slide" data-bind="attr: { 'data-modelId': $data.ModelId }">
                <div class="image">
                    <img alt="" class="model-image-preview" data-bind="attr: { src: $data.ImageUrl }" />
                    <div data-bind="css: { 'scribe-image-for-one': $parent.ModelDtos.length < 3, 'scribe-image': $parent.ModelDtos.length >= 3 }">
                        <span data-bind="    text: 'Цена: ' + $data.SalePrice"></span>&nbsp;&nbsp;<span data-bind="    visible: $data.Sale > 0, text: 'Скидка: ' + $data.Sale + '%'"></span>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div data-bind="attr: { 'class': 'pagination-kit-models p-kit-' + KitId }"></div>
</div>
